
import AssigneeSelect from "@/app/issues/[id]/AssigneeSelect";
import EditIssueButton from "@/app/issues/[id]/EditIssueButton";
import prisma from "@/prisma/client";
import { Box, Flex, Grid, } from "@radix-ui/themes";
import { notFound } from "next/navigation";
import React, { cache } from 'react';
import IssueDetail from "@/app/issues/[id]/IssueDetail";
import DeleteIssueButton from "./DeleteIssueButton";
import { getServerSession } from "next-auth";
import { authOptions } from "@/app/api/auth/[...nextauth]/route";


interface Props {
    params: { id: string }
}

export async  function generateMetadata({params}:Props){
    const issue= await fetchIssue(parseInt(params.id));
    return{
        title:issue?.title,
        description:"Details of issue"+issue?.id,
    }
}

const fetchIssue = cache(  async (issueId:number)=>{
   return  prisma.issue.findUnique({where:{id:issueId}});
})

const IssueDetailPage = async ({ params }: Props) => {
    //await delay(2000);
    const session = await getServerSession(authOptions);
    const issue =await fetchIssue(parseInt(params.id));
    if (!issue) notFound();
    return (
        <>
            <Grid columns={{ initial: "1", sm: "5" }} gap={"4"}>
                <Box className="md:col-span-4">
                    <IssueDetail issue={issue} />
                </Box>
                <Box className={"max-w-xl"}>
                    {session && (
                        <Flex direction={'column'} gap={'3'}>
                            <AssigneeSelect issue={issue} />
                            <EditIssueButton issueId={issue.id} />
                            <DeleteIssueButton issueId={parseInt(params.id)} />
                        </Flex>
                    )}

                </Box>
            </Grid>

        </>
    );
};

export default IssueDetailPage;